<template>
  <div style="margin-left: 2%;margin-right: 2%">

    <div style="margin-top: .8%;text-align: right">
      <el-button size="mini" type="primary" @click="centerDialogVisible = true">添加</el-button>
    </div>


    <div class="spacer"></div>

  <div>
    <el-table :data="governmentDirectoryTable" border v-loading="loading" style="width: 100%">
      <!-- 其他列 -->

      <el-table-column
          type="index"
          label="序号"
          width="100"
          align="center"
      >
      </el-table-column>
      <el-table-column
              prop="governmentDirectoryid"
              min-width="200px"
              label="序号"
              v-if="false"
      >
      </el-table-column>
      <el-table-column
              prop="encoding"
              min-width="200px"
              label="编码"
      >
      </el-table-column>

      <el-table-column
              prop="items"
              min-width="200px"
              label="品目"
      >
      </el-table-column>

      <el-table-column
              prop="remark"
              min-width="200px"
              label="备注"
      >
      </el-table-column>

      <el-table-column
              prop="standard"
              min-width="200px"
              label="标准（万）"
      >
      </el-table-column>


    <el-table-column label="操作" width="200">
      <template slot-scope="{$index,row}">
        <el-button @click="delGorDir(row)" type="danger" size="small">删除</el-button>
        <el-button @click="openEditDialog(row)" type="primary" size="small">修改</el-button>
      </template>
    </el-table-column>

    </el-table>

  <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-sizes="[20, 50, 100, 200]"
      :page-size="thisData.pageSize"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total">
  </el-pagination>

    <!--    添加负面清单-->
    <el-dialog
        title="添加集采目录"
        :visible.sync="centerDialogVisible"
        width="39%"
        center>
      <el-form ref="addGovernmentDirectory" :rules="rules" :model="addGovernmentDirectory" label-width="80px">


        <el-form-item label="编码" prop="encoding">
          <el-input v-model="addGovernmentDirectory.encoding" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="品目" prop="items">
          <el-input v-model="addGovernmentDirectory.items" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="addGovernmentDirectory.remark" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="标准" prop="standard">
          <el-input v-model="addGovernmentDirectory.standard" placeholder="请输入内容"></el-input>
        </el-form-item>
      </el-form>
      <div style="text-align: center">
        <el-button @click="cancelAddGorDir">取 消</el-button>
        <el-button type="primary" @click="submitGorDir">提 交</el-button>
      </div>
    </el-dialog>

    <el-dialog
            title="修改集采目录"
            :visible.sync="editDialogVisible"
            width="39%"
            center
    >
      <el-form ref="editGovernmentDirectory" :rules="rules" :model="editGovernmentDirectory" label-width="80px">
        <el-form-item label="编码" prop="encoding">
          <el-input v-model="editGovernmentDirectory.encoding" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="关键词" prop="品目">
          <el-input v-model="editGovernmentDirectory.items" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="关键词" prop="备注">
          <el-input v-model="editGovernmentDirectory.remark" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="关键词" prop="标准">
          <el-input v-model="editGovernmentDirectory.standard" placeholder="请输入内容"></el-input>
        </el-form-item>
      </el-form>
      <div style="text-align: center">
        <el-button @click="cancelEditGovernmentDirectory">取 消</el-button>
        <el-button type="primary" @click="submitEditGovernmentDirectory">提 交</el-button>
      </div>
    </el-dialog>


  </div>
  </div>
</template>

<script>
import { addGovernmentDirectory,selectAllGovernmentDirectory, deleteGovernmentDirectory,updateGovernmentDirectory} from "@/api/gather/governmentDirectory";
import axios from "axios";


export default {

  mounted() {
    // 初始化显示所有数据
    this.selectGovernmentDirectory()
  },

  methods: {
    handleClick(row) {
      console.log(row);
    },
    async selectGovernmentDirectory() {
      this.loading = true
      let data = this.currentPage + '/' + this.thisData.pageSize
      let res = await selectAllGovernmentDirectory(data)
      console.log("======================="+res)
      if (res) {
        this.loading = false
      }
      if (res.data.code === 200) {
        this.governmentDirectoryTable = res.data.data.record
        this.total = res.data.data.total
      } else {
        this.$message({
          message: `${res.data.data.msg}`,
          type: 'warning'
        });
      }
    },
    handleSizeChange(val) {
      this.thisData.pageSize = val
      this.selectGovernmentDirectory()

    },
    handleCurrentChange(val) {
      this.currentPage = val
      this.selectGovernmentDirectory()
    },

    // 打开修改负面清单对话框，并将选中行的数据绑定到表单中
    openEditDialog(row) {
      this.editGovernmentDirectory.governmentDirectoryid = row.governmentDirectoryid;
      this.editGovernmentDirectory.encoding=row.encoding;
      this.editGovernmentDirectory.items = row.items;
      this.editGovernmentDirectory.remark = row.remark;
      this.editGovernmentDirectory.standard = row.standard;

      // 可以根据需要执行其他操作

      // 最后，设置对话框的显示状态为 true
      this.editDialogVisible = true;
    },


    delGorDir(row) {
        this.$confirm('确认删除该项吗?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {

          let res = await deleteGovernmentDirectory(row.governmentDirectoryid)
          if (res.data.code === 200) {
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
            await this.selectGovernmentDirectory()

          } else {
            this.$message.error(res.data.msg)
          }

        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
    },

    async submitGorDir() {
      this.$refs.addGovernmentDirectory.validate(async (valid) => {
        if (valid) {
          // delete this.addUser.repeatPassword

          let res = await addGovernmentDirectory(this.addGovernmentDirectory)
          if (res.data.code === 200) {
            this.$message({
              message: '添加成功',
              type: 'success'
            });
            this.addGovernmentDirectory = {
              governmentDirectoryid: '',
              encoding: '',
              items: '',
              remark: '',
              standard: '',
            }
            // 重置字段信息
            this.$refs["addGovernmentDirectory"].resetFields();
            // 获得个人的
            await this.selectGovernmentDirectory()
            this.centerDialogVisible = false
          } else {
            this.$message.error(res.data.msg)
          }
        } else {
          this.$message.error('请确保信息完整！')
          return false;
        }
      })
    },
    async submitEditGovernmentDirectory() {

      this.$refs.editGovernmentDirectory.validate(async (valid) => {
        if (valid) {
          // delete this.addUser.repeatPassword

          let res = await updateGovernmentDirectory(this.editGovernmentDirectory)
          if (res.data.code === 200) {
            this.$message({
              message: '修改成功',
              type: 'success'
            });
            this.editGovernmentDirectory = {
              governmentDirectoryid: '',
              encoding: '',
              items: '',
              remark: '',
              standard: '',
            }
            // 重置字段信息
            this.$refs["editGovernmentDirectory"].resetFields();
            // 重新获取
            await this.selectGovernmentDirectory()
            this.editDialogVisible = false
          } else {
            this.$message.error(res.data.msg)
          }
        } else {
          this.$message.error('请确保信息完整！')
          return false;
        }
      })
    },

    cancelAddGorDir() {
      this.$refs["addGovernmentDirectory"].resetFields();
      this.centerDialogVisible = false
      this.addGovernmentDirectory = {
        governmentDirectoryid: '',
        encoding: '',
        items: '',
        remark: '',
        standard: '',
      }
      this.$message({
        message: '已取消操作',
      });

    },
    //取消修改
    cancelEditGovernmentDirectory() {
      this.$refs["editGovernmentDirectory"].resetFields();
      this.editDialogVisible = false
      this.editGovernmentDirectory = {
        governmentDirectoryid: '',
        encoding: '',
        items: '',
        remark: '',
        standard: '',
      }
      this.$message({
        message: '已取消操作',
      });

    },
  },


  created() {

  //   let _this = this
  //   axios.get('http://localhost:54188/api/negative/list').then(function (response) {
  //     console.log(response)
  //     _this.tableData = response.data
  //   })


  },

  data() {
    return {
      rules: {
        encoding: [{required: true, message: '请输入', trigger: ['blur', 'change']}],
      },
      tableData: [

      ],
      currentPage: 1,
      centerDialogVisible: false,
      editDialogVisible: false,
      loading: true,
      governmentDirectoryTable: [],
      total: 0,
      thisData: {
        page: 1,
        pageSize: 20,
      },
      addGovernmentDirectory: {
        governmentDirectoryid: '',
        encoding: '',
        items: '',
        remark: '',
        standard: '',
      },
      editGovernmentDirectory: {
        governmentDirectoryid: '',
        encoding: '',
        items: '',
        remark: '',
        standard: '',
      },
    }
  },

}
</script>
